<template>
  <!-- 202311 -->
  <a-spin :spinning="loading">
    <div class="wms-in-bound-page">
      <!-- <div class="in-bound-page-block block-three">
        <div style="width:580px;margin:0 auto">
          入库类型：
          <a-radio-group v-model="receiptType" @change="onChange">
            <a-radio v-for="(item, index) in taskModelData" :value="item.code" :key="'destination-sel-' + index">
              {{ item.name }}
            </a-radio>
          </a-radio-group>
        </div>
      </div> -->

      <div class="in-bound-page-block block-one">
        <search-box label="托盘号" v-model="containterTph" :msg-type="msgType.containter" :msg="msg.containter"
          :label-width="labelWidth" placeholder="请输入..." @search="onContainterSearch" @reset="onContainterReset" />
      </div>


      <div class="in-bound-page-block block-one">
        <search-box label="物料号" v-model="materialNoSaoma" :msg-type="msgType.materialNoSaoma" :msg="msg.materialNoSaoma"
          :label-width="labelWidth" placeholder="请输入..." @search="onMaterialSearch" @reset="onmaterialReset" />
      </div>



      <div class="in-bound-page-block block-two">
        <div class="table-top-box">
          <!-- v-if="receiptType == 2" -->
          <!-- <a-button type="primary" @click="onAddMaterial" >添加物料</a-button> -->
        </div>
        <!-- v-if="receiptType == 2" -->
        <div class="table-box">
          <a-table :columns="columns" :data-source="list" :row-key="tableKey" :pagination="false">
            <template slot="index" slot-scope="text, record, index">{{ index + 1 }}</template>
            <template slot="specSlots" slot-scope="text, record">
              {{ record.long }}*{{ record.wide }}*{{ record.high }}
            </template>
            <template slot="action" slot-scope="text, record, index">
              <a-button type="danger" @click.stop="onDel(record, index)">删 除</a-button>
            </template>
          </a-table>
        </div>
      </div>
      <div class="in-bound-page-block block-three">
        <div class="block-three-input-box">
          <a-row :gutter="32">
            <a-col :md="12" :sm="24">
              <input-layout label="入库口" :label-width="labelWidth">
                <a-select v-model="sourcePlace" placeholder="请选择..." style="width:100%;" allowClear>
                  <a-select-option v-for="(item, index) in selectList.entrances" :value="item"
                    :key="'entrance-sel-' + index">{{ item }}</a-select-option>
                </a-select>
              </input-layout>
            </a-col>
            <a-col :md="12" :sm="24">
              <input-layout label="库位号" :label-width="labelWidth">
                <a-input placeholder="请输入..." v-model.trim="placecode" />
              </input-layout>
            </a-col>
          </a-row>
        </div>
      </div>
      <div class="bottom-btns-view">
        <!-- <a-button type="primary" :disabled="bindBtnDisabled" @click="onBind">组盘</a-button> -->
        <!-- <a-button type="primary" @click="onAutoIntrance">自动入库</a-button> -->

        <a-button type="primary" @click="onRk(1)">组盘</a-button>
        <a-button type="primary"  :disabled="sourcePlace==''" @click="onRk(2)">自动入库</a-button>
        <a-button type="primary" :disabled="placecode==''" @click="onRk(3)">人工入库</a-button>
        <a-button @click="onReset">重 置</a-button>
      </div>

      <edit-form ref="form" @callback="handleOk" />
    </div>
  </a-spin>
</template>
<script>
import SearchBox from './searchBox.vue'
import InputLayout from './inputLayout.vue'
import editForm from './editForm.vue'
import StationSelect from '@/components/StationSelect.vue'
import {
  BindEntranceGetContainer,
  BindAction,
  BindEntranceAutoWare,
  AutoWare, // 1109
  automaticWarehousing, // 1109
  manualWarehousing, // 1109
  MaterialRukuPage, // 1109
} from '@/api/modular/main/BindEntranceManage'

export default {
  name: 'wmsBindEntrancePage',
  components: { SearchBox, InputLayout, editForm, StationSelect },
  data() {
    return {
      loading: false,
      labelWidth: '75px',
      containter: null,
      receiptType: "", //1 空托 2 物料
      msg: {
        containter: '',
        materialNoSaoma:''
      },
      msgType: {
        containter: '',
        materialNoSaoma:''
      },
      containterTph: '',
      sufFrom: {
        stationArr: []
      },
      selectList: {
        entrances: ['入库口'],
        destinations: []
      },
      tableKey: 'materialNo',
      list: [
        // {
        //   "materialName": "88888888888888888888",
        //   "materialNo": 1111111,
        //   "materialId": 0,
        //   "materialBatch": "3333333",
        //   "materialType": 1,
        //   "inspectionMethod": 1,
        //   "materialSpec": "444",
        //   "materialDensity": "5",
        //   "materialUnit": "6",
        //   "lesWorkshopSection": 1
        // }
      ],
      columns: [
        {
          dataIndex: 'index',
          title: '序号',
          fixed: 'left',
          width: '60',
          scopedSlots: { customRender: 'index' }
        },
        {
          dataIndex: 'materialNo',
          title: '物料编号'
        },
        {
          dataIndex: 'materialName',
          title: '物料名称'
        },
        {
          dataIndex: 'materialBatch',
          title: '物料批次'
        },
        // {
        //   dataIndex:'MaterialDensity',
        //   title:'MaterialDensity'
        // },
   
        // {
        //   dataIndex:'materialspec',
        //   title:'尺寸',
        //   scopedSlots: { customRender: 'specSlots' }
        // },
        {
          dataIndex: 'action',
          title: '操作',
          fixed: 'right',
          width: '70',
          scopedSlots: { customRender: 'action' }
        }
      ],
      taskModelData: [

      ],
      containter: {
        "containerCode": ""
      },
      materialNoSaoma:"",
      sourcePlace:"",
      bindBtnDisabled:true,
      placecode:""
    }
  },
  computed: {
    // bindBtnDisabled() {
    //   let res = true;
    //   if (this.containter && (this.containter.containerStatus === 1 || this.containter.containerStatus === 2) && this.list.length > 0) {
    //     res = false;
    //   }
    //   return res;
    // },
    // autoIntranceBtnDisabled() {
    //   let res = true;
    //   if (this.containter && (this.containter.containerStatus === 1 || this.containter.containerStatus === 2) && this.list.length > 0 && this.sufFrom.stationArr.length === 2) {
    //     res = false;
    //   }
    //   return res;
    // }
  },
  created() {
    const taskModelOption = this.$options
    this.taskModelData = taskModelOption.filters['dictData']('ruku_type')
    // this.$nextTick(() => {
    //   // this.columns = this.columnone;
    // })
  },
  methods: {
    onContainterReset() {
      this.resetContainter()
    },

  
    onContainterSearch() {
      if (!this.containterTph) {
        this.msgType.containter = 'error'
        this.msg.containter = '请输入托盘号！';
        return false;
      }

      this.msg.containter = ''
      this.loading = true;
      this.getContainterInfo((f) => {
        this.loading = false;
      })

    },

    // 扫物料号
    onMaterialSearch() {
      if (this.materialNoSaoma=='') {
        this.$message.warning(`请输入物料号！`);
        return
      }

     // this.msg.materialNoSaoma = ''
      this.loading = true;
      let params = {
        MaterialNo:this.materialNoSaoma
      }
      MaterialRukuPage(params).then((res) => {
        this.loading = false;
        if(res.data){
          let arr1 = this.list.filter((v)=> v.materialNo == res.data.materialNo );
          if(arr1.length>0){
            this.$message.warning(`此物料已经在列表中存在！`);
            return
          }
          this.list.unshift(res.data)
          this.msgType.materialNoSaoma = ''
          this.msg.materialNoSaoma = '';
        }else{
            this.msgType.materialNoSaoma = 'error'
            this.msg.materialNoSaoma = '物料不存在！';
          // this.$message.warning(`物料不存在！`);
        }
      }).catch(err => {
        //this.$message.error(err);
      })

    },
    onmaterialReset() {
      this.materialNoSaoma = ""
    },

    resetContainter() {
      this.clearContainter()
      this.clearBackContainer()
    },
    // 清空托盘号
    clearContainter() {
      this.containterTph = ''
      this.msg.container = ''
      this.msgType.containter = ''
      
    },
    clearBackContainer() {
      this.containter = null
    },
    resetSufFrom() {
      this.sufFrom.stationArr = []
    },
    getContainterInfo(callback) {
      let params = { Containercode: this.containterTph }
      const __setErrMessage = function (__msg) {
        if (!__msg) {
          __msg = '网络错误，请稍后再尝试！'
        }
        this.msgType.containter = 'error'
        this.msg.containter = "托盘不存在！";
      }.bind(this)
      BindEntranceGetContainer(params).then((d) => {
        if (d.data) {
          if (d.data.containerCode) {
            this.containter = d.data.wmsContainer
            let _arr = d.data.wmsMaterials || []
            if (_arr.length > 0) {
              this.list = _arr
            }
            this.msgType.containter = 'info'
            this.msg.containter = `尺寸：${this.containter.specLength}*${this.containter.specWidth}`;
            this.containterTph = d.data.containerCode
            callback && callback(true)
          } else {
            this.clearBackContainer()
            __setErrMessage(d.message)
            callback && callback(false)
          }
        } else {
          this.clearBackContainer()
          __setErrMessage(d.message)
          callback && callback(false)
        }
      }).catch((err) => {
        this.clearBackContainer()
        __setErrMessage()
        callback && callback(false)
      })

    },
    onAddMaterial() {
      this.$refs.form.init()
    },
    handleOk(obj) {
      this.addToList(obj)
    },
    addToList(obj) {
      let f = false, _no = "";
      for (let i = 0; i < this.list.length; i++) {
        if (this.list[i][this.tableKey] === obj[this.tableKey]) {
          f = true
          _no = this.list[i][this.tableKey]
          break;
        }
      }
      if (!f) {
        this.list.unshift(obj)
      } else {
        this.$message.warning(`物料${_no}已存在！`);
      }
    },
    onDel(obj, index) {
      this.list.splice(index, 1)
    },
    onAutoIntrance() {
      this.loading = true;
      this.dealAutoIntrance((f) => {
        this.loading = false;
        if (f) {
          this.$message.success('入库成功！');
          this.resetContainter()
          this.resetSufFrom()
          this.list = [];
        }
      })
    },
    onBind() {
      this.loading = true;
      this.dealBind((f) => {
        if (f) {

          this.getContainterInfo((f1) => {
            this.loading = false;
            this.$message.success('组盘成功！');
          })
        } else {
          this.loading = false;
        }
      })
    },
    onReset() {
      this.receiptType = ''
      this.sourcePlace = ''
      this.placecode = ''
      this.containterTph = ''
      this.msg.containter = ''
      this.materialNoSaoma =''
      this.resetContainter()
      this.resetSufFrom()
      this.list = [];
    },
    dealBind(callback) {
      let params = {
        containerCode: this.containter.containerCode,
        wmsMaterials: this.list
      }
      BindAction(params).then(() => {
        callback && callback(true)
      }).catch(() => {
        callback && callback(false)
      })
    },
    dealAutoIntrance(callback) {
      let params = {
        containerCode: this.containter.containerCode,
        wmsMaterials: this.list
        // stationCode:this.sufFrom.stationArr[1]
      }
      BindEntranceAutoWare(params).then(() => {
        callback && callback(true)
      }).catch(() => {
        callback && callback(false)
      })
    },
    onChange() {

    },
    //入库
    onRk(param) {
      // if (this.receiptType == '') {
      //   this.$message.warning(`请选择入库类型！`);
      //   return;
      // }
      
      if (this.containterTph == '' || this.containterTph== null || this.containterTph == undefined) {
        this.$message.warning(`请输入托盘号！`);
        return;
      }



      let params = {
        containerCode: this.containterTph || '',
        source: 1, //this.receiptType
        placeCode: this.placecode, //库位号
        sourcePlace: this.sourcePlace, //入库口
        wmsMaterials: this.list
      }

      // 组盘
      if (param == 1) {
        AutoWare(params).then(() => {
          this.loading = false;
          this.$message.success('组盘成功！');
          this.onReset()
        }).catch(err => {
         // this.$message.error(err);
          })
      }

      // 自动入库
      if (param == 2) {
        automaticWarehousing(params).then(() => {
          this.loading = false;
          this.$message.success('自动入库成功！');
          this.onReset()
        }).catch(err => {
        //  this.$message.error(err);
          })
      }

      // 人工入库
      if (param == 3) {
        manualWarehousing(params).then(() => {
          this.loading = false;
          this.$message.success('人工入库成功！');
          this.onReset()
        }).catch(err => {
          //this.$message.error(err);
        })
      }
    }
  }
}
</script>
<style lang="less" scoped>
.wms-in-bound-page {
  border-radius: 6px 6px 0 0;
  background-color: #fff;
}

.in-bound-page-block {
  border-bottom: 2px solid #dcdcdc;
  overflow: auto;
  padding-top: 16px;
  padding-bottom: 16px;

  &.block-two {
    padding-top: 12px;

    .table-box {
      padding-top: 20px;
      min-height: 241px;
    }
  }

  &.block-three {
    overflow: hidden;
    padding-left: 8px;
    padding-right: 8px;
  }
}

.bottom-btns-view {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  padding: 16px 8px;

  .ant-btn+.ant-btn {
    margin-left: 20px;
  }
}

.block-three-input-box {
  margin: 0 auto;
  width: 600px;
}

.table-top-box {
  padding-left: 20px;
}
</style>
